//
//  SegmentButton.swift
//  xgwjinterconnection
//  自定义分段按钮
//  Created by WangWeiShuo on 2025/8/19.
//

import SwiftUI
struct SegmentItem : Hashable {
      var title : String = ""
      var color : Color = Color.white
      var selectionIndex = 0
}

struct SegmentButton : View {

      @Binding var selection : Int
      var items : [SegmentItem]

      var body : some View {

            let width : CGFloat = 110.0

            return HStack(spacing: 5) {
                  ForEach (items, id: \.self) { item in
                      SegmentButtonView(text: item.title, width: width, color: item.color, selectionIndex: item.selectionIndex, selection: self.$selection)
                  }
            }.font(.body)
                  .padding(5)
                  .background(Color.gray)
                  .cornerRadius(10.0)
      }
}

struct SegmentButtonView : View {

      var text : String
      var width : CGFloat
      var color : Color
      var selectionIndex = 0
      @Binding var selection : Int

      var body : some View {
            let label = Text(text)
                  .padding(5)
                  .frame(width: width)
                  .background(color).opacity(selection == selectionIndex ? 1.0 : 0.5)
                  .cornerRadius(10.0)
                  .foregroundColor(Color.white)
                  .font(Font.body.weight(selection == selectionIndex ? .bold : .regular))

            return Button(action: { self.selection = self.selectionIndex }) { label }
      }
}

struct CustomSegmentedControl: View {
    // 选项数组
    let options: [String]
    // 选中索引绑定
    @Binding var selectedIndex: Int
    // 自定义高度
    var height: CGFloat = 50
    
    var radius: CGFloat = 10
    
    var body: some View {
        GeometryReader { geometry in
            ZStack(alignment: .leading) {
                // 背景
                RoundedRectangle(cornerRadius: radius)
                    .fill(Color(.systemGray5))
                
                // 选中指示器
                RoundedRectangle(cornerRadius: radius)
                    .fill(Color.blue)
                    .frame(width: geometry.size.width / CGFloat(options.count), height: height)
                    .offset(x: CGFloat(selectedIndex) * (geometry.size.width / CGFloat(options.count)))
                    .animation(.spring(), value: selectedIndex) // 滑动动画
                
                // 选项按钮
                HStack(spacing: 0) {
                    ForEach(0..<options.count, id: \.self) { index in
                        Button(action: {
                            selectedIndex = index
                        }) {
                            Text(options[index])
                                .foregroundColor(selectedIndex == index ? .white : .black)
                                .frame(width: geometry.size.width / CGFloat(options.count), height: height)
                        }
                    }
                }
            }
            .frame(height: height)
        }
    }
}

